
<!DOCTYPE HTML>
<html lang="en"  xmlns:th="http://www.thymeleaf.org"
      xmlns:shiro="http://www.pollix.at/thymeleaf/shiro">
<head>
    <meta charset="utf-8">
    <meta name="renderer" content="webkit|ie-comp|ie-stand">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1.0,maximum-scale=1.0,user-scalable=no" />
    <meta http-equiv="Cache-Control" content="no-siteapp" />
    <link rel="Bookmark" href="favicon.ico" >
    <link rel="Shortcut Icon" href="favicon.ico" />
    <!--[if lt IE 9]>
    <script type="text/javascript" th:src="@{/assets/js/html5.js}"></script>
    <script type="text/javascript" th:src="@{/lib/respond.min.js}"></script>
    <![endif]-->
    <link rel="stylesheet" type="text/css" th:href="@{/static/h-ui/css/H-ui.min.css}" />
    <link rel="stylesheet" type="text/css" th:href="@{/static/h-ui.admin/css/H-ui.admin.css}" />
    <link rel="stylesheet" type="text/css" th:href="@{/lib/Hui-iconfont/1.0.8/iconfont.css}" />
    <link rel="stylesheet" type="text/css" th:href="@{/static/h-ui.admin/skin/default/skin.css}" id="skin" />
    <link rel="stylesheet" type="text/css" th:href="@{/static/h-ui.admin/css/style.css}" />
    <!--[if IE 6]>
    <script type="text/javascript" th:src="@{/assets/js/DD_belatedPNG_0.0.8a-min.js}"></script>
    <script>DD_belatedPNG.fix('*');</script>
    <![endif]-->


    <title>管理员系统</title>
</head>
<body>

<header class="navbar-wrapper">
    <div class="navbar navbar-fixed-top">
        <div class="container-fluid cl"> <a class="logo navbar-logo f-l mr-10 hidden-xs" href="/index">H-ui.admin</a> <a class="logo navbar-logo-m f-l mr-10 visible-xs" href="/index">H-ui</a>
            <span class="logo navbar-slogan f-l mr-10 hidden-xs">v3.0</span>
            <a aria-hidden="false" class="nav-toggle Hui-iconfont visible-xs" href="javascript:;">&#xe667;</a>
            <nav class="nav navbar-nav">
                <ul class="cl">
                    <li class="dropDown dropDown_hover"><a href="javascript:;" class="dropDown_A"><i class="Hui-iconfont">&#xe600;</i> 新增 <i class="Hui-iconfont">&#xe6d5;</i></a>
                        <ul class="dropDown-menu menu radius box-shadow">
                            <li><a href="javascript:;" onclick="article_add('添加资讯','article-add')"><i class="Hui-iconfont">&#xe616;</i> 资讯</a></li>
                            <li><a href="javascript:;" onclick="picture_add('添加资讯','picture-add')"><i class="Hui-iconfont">&#xe613;</i> 图片</a></li>
                            <li><a href="javascript:;" onclick="product_add('添加资讯','product-add')"><i class="Hui-iconfont">&#xe620;</i> 产品</a></li>
                            <li><a href="javascript:;" onclick="member_add('添加用户','admin-add','','510')"><i class="Hui-iconfont">&#xe60d;</i> 用户</a></li>
                        </ul>
                    </li>
                </ul>
            </nav>

            <nav id="Hui-userbar" class="nav navbar-nav navbar-userbar hidden-xs">
                <ul class="cl">
                    <li th:each="role : ${currectRole}" th:text="${role.roleName}" class="cueeectrole">超级管理员</li>
                    <li class="dropDown dropDown_hover"> <a href="#" class="dropDown_A"><span id="currentUsername" th:text="${currectuser}"></span><i class="Hui-iconfont">&#xe6d5;</i></a>
                        <ul class="dropDown-menu menu radius box-shadow">
                            <li><a href="javascript:;" onClick="myselfinfo()">个人信息</a></li>
                            <li><a href="#">切换账户</a></li>
                            <li><a id="doLogout" th:href="@{/doLogout}">退出</a></li>
                        </ul>
                    </li>

                    <li id="Hui-msg"> <a href="#" title="消息"><span class="badge badge-danger">1</span><i class="Hui-iconfont" style="font-size:18px">&#xe68a;</i></a> </li>
                    <li id="Hui-skin" class="dropDown right dropDown_hover"> <a href="javascript:;" class="dropDown_A" title="换肤"><i class="Hui-iconfont" style="font-size:18px">&#xe62a;</i></a>
                        <ul class="dropDown-menu menu radius box-shadow">
                            <li><a href="javascript:;" data-val="default" title="默认（黑色）">默认（黑色）</a></li>
                            <li><a href="javascript:;" data-val="blue" title="蓝色">蓝色</a></li>
                            <li><a href="javascript:;" data-val="green" title="绿色">绿色</a></li>
                            <li><a href="javascript:;" data-val="red" title="红色">红色</a></li>
                            <li><a href="javascript:;" data-val="yellow" title="黄色">黄色</a></li>
                            <li><a href="javascript:;" data-val="orange" title="橙色">橙色</a></li>
                        </ul>
                    </li>
                </ul>
            </nav>
        </div>
    </div>
</header>



<aside class="Hui-aside">

    <div class="menu_dropdown bk_2">
        <dl id="menu-article">
            <dt><i class="Hui-iconfont">&#xe695;</i> 用户信息管理<i class="Hui-iconfont menu_dropdown-arrow">&#xe685;</i></dt>
            <dd>
                <ul>
                    <li><a href="User" title="用户列表">用户列表</a></li>
                    <li><a href="selectLits" title="步数明细">步数明细</a></li>
                    <li><a href="virtual_currency" title="货币兑换记录">货币兑换记录</a></li>
                </ul>
            </dd>
        </dl>
        <dl id="menu-picture">
            <dt><i class="Hui-iconfont">&#xe613;</i> 商品管理信息<i class="Hui-iconfont menu_dropdown-arrow">&#xe685;</i></dt>
            <dd>
                <ul>
                    <li><a href="commodity_shelves" title="图片管理">商品上架</a></li>
                    <li><a href="commodity_frame" title="图片管理">商品下架</a></li>
                    <li><a href="product_category" title="图片管理">商品分类</a></li>
                </ul>
            </dd>
        </dl>

        <dl id="menu-comments">
            <dt><i class="Hui-iconfont">&#xe622;</i>活动模块<i class="Hui-iconfont menu_dropdown-arrow">&#xe685;</i></dt>
            <dd>
                <ul>
                    <li><a href="#" title="转盘设置">转盘设置</a></li>
                    <li><a href="LotteryRecord_list" title="抽奖记录">抽奖记录</a></li>
                </ul>
            </dd>
        </dl>
        <dl id="menu-admin">
            <dt><i class="Hui-iconfont">&#xe62d;</i> 管理员设置<i class="Hui-iconfont menu_dropdown-arrow">&#xe685;</i></dt>
            <dd>
                <ul>
                    <li><a href="#" th:href="@{/listRole}" title="功能显示">角色管理</a></li>
                    <li><a href="admin_permission" title="具体负责模块">权限管理</a></li>
                    <li><a href="SysUser_list" title="管理员列表">管理员列表</a></li>
                </ul>
            </dd>
        </dl>

    </div>
</aside>
<div class="dislpayArrow hidden-xs"><a class="pngfix" href="javascript:void(0);" onClick="displaynavbar(this)"></a></div>


<section class="Hui-article-box">
    <nav class="breadcrumb"><i class="Hui-iconfont">&#xe67f;</i> 首页
        <span class="c-gray en">&gt;</span>
        管理员管理
        <span class="c-gray en">&gt;</span>
        管理员列表 <a id="refesh" class="btn btn-success radius r" style="line-height:1.6em;margin-top:3px" href="javascript:location.replace(location.href);" title="刷新" ><i class="Hui-iconfont">&#xe68f;</i></a> </nav>
    <div class="Hui-article">
        <article class="cl pd-20">
            <div class="text-c"> 日期范围：
                <input type="text" onfocus="WdatePicker({maxDate:'#F{$dp.$D(\'datemax\')||\'%y-%M-%d\'}'})" id="datemin" class="input-text Wdate" style="width:120px;">
                -
                <input type="text" onfocus="WdatePicker({minDate:'#F{$dp.$D(\'datemin\')}',maxDate:'%y-%M-%d'})" id="datemax" class="input-text Wdate" style="width:120px;">
                <input type="text" class="input-text" style="width:250px" placeholder="输入管理员名称" id="condition_username" name="" oninput="realTimeQuery(this)">
                <button type="submit" class="btn btn-success"  name="" onclick="realTimeQueryOnClick(this)" onsubmit="return false"><i class="Hui-iconfont">&#xe665;</i> 搜用户</button>
                <button class="btn btn-success"  name="" onclick="resetCondition(this)">重置</button>
            </div>
            <div class="cl pd-5 bg-1 bk-gray mt-20">
                <span class="l"> <a href="javascript:;" onclick="datadel()" class="btn btn-danger radius"><i class="Hui-iconfont">&#xe6e2;</i> 批量删除</a> <a href="javascript:;" onclick="admin_add('添加管理员','admin-add','800','500')" class="btn btn-primary radius"><i class="Hui-iconfont">&#xe600;</i> 添加管理员</a> </span>
                <span class="r">共有管理员：<strong id="userSize" th:text="${userListSize}"></strong> 位</span>
            </div>
            <table class="table table-border table-bordered table-bg">
                <thead>
                <tr>
                    <th scope="col" colspan="9">员工列表</th>
                </tr>
                <tr class="text-c">
                    <th width="25"><input type="checkbox" name="" value=""></th>
                    <th width="40">ID</th>
                    <th width="150">登录名</th>
                    <th width="90">手机</th>
                    <th width="150">邮箱</th>
                    <th>角色</th>
                    <th width="130">加入时间</th>
                    <th width="100">是否已启用</th>
                    <th width="100">操作</th>
                </tr>
                </thead>
                <tbody>
                <tr class="text-c text-abc" th:each="user,count:${userList}">
                    <td><input type="checkbox" th:id="check+${user.userId}" class="userCheck" name=""></td>
                    <td class="userId" th:text="${user.userId}"></td>
                    <td class="username" th:text="${user.username}"></td>
                    <td class="mobile" th:text="${user.mobile}"></td>
                    <td class="email" th:text="${user.email}"></td>
                    <td class="deptId" th:object="${user.role}" th:text="${user.role.roleName}"></td>
                    <td class="createTime" th:text="${#dates.format(user.createTime,'yyyy-MM-dd')}"></td>
                    <td class="td-status"><span class="label label-success radius status" th:if="${user.status}==1">已启用</span><span class="label label-default radius" th:if="!(${user.status}==1)">已禁用</span></td>
                    <td class="td-manage"><a th:if="${user.status}==1" style="text-decoration:none" onClick="admin_stop(this,'10001')" href="javascript:;" title="停用"><i class="Hui-iconfont">&#xe631;</i></a>       <a th:if="!(${user.status}==1)" onclick="admin_start(this,id)" href="javascript:;" title="启用" style="text-decoration:none"><i class="Hui-iconfont"></i></a>
                        <a title="编辑" href="javascript:;" onclick="admin_edit(this,'管理员编辑','adminEdit','1','800','500')" class="ml-5" style="text-decoration:none"><i class="Hui-iconfont">&#xe6df;</i></a> <a title="删除" href="javascript:;" onclick="admin_del(this,'1')" class="ml-5 delButton" style="text-decoration:none"><i class="Hui-iconfont">&#xe6e2;</i></a></td>
                </tr>

                </tbody>
            </table>
        </article>
    </div>
</section>

<script type="text/javascript" th:src="@{/lib/jquery/1.9.1/jquery.min.js}"></script>
<script type="text/javascript" th:src="@{/lib/layer/2.4/layer.js}"></script>
<script type="text/javascript" th:src="@{/static/h-ui/js/H-ui.js}"></script>
<script type="text/javascript" th:src="@{/static/h-ui.admin/js/H-ui.admin.page.js}"></script>
<script th:inline="javascript">


    /*批量删除 */
    function datadel(){
        var beCheckedId = [];
       var checkedBox= $(".userCheck");
        var i=0;
        var flag=false;
       checkedBox.each(function(index,element){
           var libUsername = $(element).parents("tr").find(".username").html();//获取当前checkBox对应的username
           var currentUsername = $("#currentUsername").html();
           var contrastResult = libUsername==currentUsername;
           if(element.checked==true){
               if(!contrastResult){
                   var userId = $(element).parents("tr").find(".userId").html();
                   beCheckedId[i]=userId;//获取被选中用户的ID
                   i++;
               }else{
                   flag = element.checked;
                   element.checked=false;
               }
           }
       });
       if(flag){
           layer.msg('无权删除自身!',{icon:2,time:1000});
       }else{
           layer.confirm('确认删除选中用户吗？',function(index){
               if(beCheckedId!=null&&beCheckedId!=""){
                   $.post("deleteMoreUser",{"beCheckedId":beCheckedId},function(data) {
                       for (var i=0;i<beCheckedId.length;i++){
                           var classname="#check"+beCheckedId[i];
                           $(classname).parents("tr").remove();
                       }
                       layer.msg('已删除!',{icon:1,time:1000});
                       $("#userSize").html(data.uSize);


                   });
               }else{
                   layer.msg('请选中!',{icon:2,time:1000});
               }
           });
       }
    }




    // 对Date的扩展，将 Date 转化为指定格式的String
    // 月(M)、日(d)、小时(h)、分(m)、秒(s)、季度(q) 可以用 1-2 个占位符，
    // 年(y)可以用 1-4 个占位符，毫秒(S)只能用 1 个占位符(是 1-3 位的数字)
    Date.prototype.Format = function (fmt) { //author: meizz
        var o = {
            "M+": this.getMonth() + 1, //月份
            "d+": this.getDate(), //日
            "H+": this.getHours(), //小时
            "m+": this.getMinutes(), //分
            "s+": this.getSeconds(), //秒
            "q+": Math.floor((this.getMonth() + 3) / 3), //季度
            "S": this.getMilliseconds() //毫秒
        };
        if (/(y+)/.test(fmt)) fmt = fmt.replace(RegExp.$1, (this.getFullYear() + "").substr(4 - RegExp.$1.length));
        for (var k in o)
            if (new RegExp("(" + k + ")").test(fmt)) fmt = fmt.replace(RegExp.$1, (RegExp.$1.length == 1) ? (o[k]) : (("00" + o[k]).substr(("" + o[k]).length)));
        return fmt;
    }

    //input变化触发
    function realTimeQuery(obj) {
        var username=$(obj).val();
        var datemin=$("#datemin").val();
        var datemax=$("#datemax").val();
        // console.log(username);
        $.post(
            "realTimeQuery",
            {"username":username,"min":datemin,"max":datemax},
            function (data) {
               $(".text-abc").remove();
               if(data!=""){
                   for (var i=0;i<data.length;i++){
                       var tr= $("<tr class='text-c text-abc'></tr>");
                       var checkbox=$("<td><input type='checkbox' value='1' name=''></td>");
                       var userId=$("<td class='userId'>"+data[i].userId+"</td>");
                       var username=$("<td class='username'>"+data[i].username+"</td>");
                       var mobile=$("<td class='userId'>"+data[i].mobile+"</td>");
                       var email=$("<td class='userId'>"+data[i].email+"</td>");
                       var deptId=$("<td class='userId'>"+data[i].role.roleName+"</td>");
                       var createTime=$("<td class='createTime'>"+new Date(data[i].createTime).Format("yyyy-MM-dd")+"</td>");
                       var tdStatusY=$("<td class='td-status'><span class='label label-success radius status'>已启用</span></td>");
                       var tdStatusN=$("<td class='td-status'><span class='label label-default radius'>已禁用</span></td>");
                       var tdManageY=$("<td class='td-manage'><a style=\"text-decoration:none\" onClick=\"admin_stop(this,'10001')\" href=\"javascript:;\" title=\"停用\"><i class=\"Hui-iconfont\">&#xe631;</i></a>\n" +
                           "<a title=\"编辑\" href=\"javascript:;\" onclick=\"admin_edit(this,'管理员编辑','adminEdit','1','800','500')\" class=\"ml-5\" style=\"text-decoration:none\"><i class=\"Hui-iconfont\">&#xe6df;</i></a> <a title=\"删除\" href=\"javascript:;\" onclick=\"admin_del(this,'1')\" class=\"ml-5\" style=\"text-decoration:none\"><i class=\"Hui-iconfont\">&#xe6e2;</i></a></td>");
                       var tdManageN=$("<td class='td-manage'><a onclick=\"admin_start(this,id)\" href=\"javascript:;\" title=\"启用\" style=\"text-decoration:none\"><i class=\"Hui-iconfont\"></i></a>\n" +
                           "<a title=\"编辑\" href=\"javascript:;\" onclick=\"admin_edit(this,'管理员编辑','adminEdit','1','800','500')\" class=\"ml-5\" style=\"text-decoration:none\"><i class=\"Hui-iconfont\">&#xe6df;</i></a> <a title=\"删除\" href=\"javascript:;\" onclick=\"admin_del(this,'1')\" class=\"ml-5\" style=\"text-decoration:none\"><i class=\"Hui-iconfont\">&#xe6e2;</i></a></td>");
                       tr.append(checkbox);
                       tr.append(userId);
                       tr.append(username);
                       tr.append(mobile);
                       tr.append(email);
                       tr.append(deptId);
                       tr.append(createTime);
                       if(data[i].status==1){
                           tr.append(tdStatusY);
                           tr.append(tdManageY);
                       }else{
                           tr.append(tdStatusN);
                           tr.append(tdManageN);
                       }
                       $("tbody").append(tr);

                   }
               }

            }
        );
    }

    //点击搜索
    function realTimeQueryOnClick(obj){
        realTimeQuery($(obj).parent().find("#condition_username"));
    }

    //重置搜索条件
    function resetCondition(obj){
        $(obj).parent().find("#datemax").val(null);
        $(obj).parent().find("#datemin").val(null);
        $(obj).parent().find("#condition_username").val(null);
        realTimeQuery($(obj).parent().find("#condition_username"));
    }



    /*
        参数解释：
        title	标题
        url		请求的url
        id		需要操作的数据id
        w		弹出层宽度（缺省调默认值）
        h		弹出层高度（缺省调默认值）
    */
    /*管理员-增加*/
    function admin_add(title,url,w,h){
        layer_show(title,url,w,h);
    }
    /*管理员-删除*/
        function admin_del(obj,id){
        var libUsername = $(obj).parents("tr").find(".username").html();
        var currentUsername = $("#currentUsername").html();
        if(currentUsername==libUsername){
            layer.msg('无权删除自身!',{icon: 5,time:1000});
            return;
        }
        layer.confirm('确认要删除吗？',function(index){
            //此处请求后台程序，下方是成功后的前台处理……
            var userId = $(obj).parents("tr").find(".userId").html();
            $.post("deleteUser",{"userId":userId,"status":status},function(data) {
                $(obj).parents("tr").remove();
                layer.msg('已删除!',{icon:1,time:1000});
                $("#userSize").html(data.uSize);

            });
        });
    }
    /*管理员-编辑*/
    function admin_edit(obj,title,url,id,w,h){
        var userId = $(obj).parents("tr").find(".userId").html();
        var currentUsername=$("#currentUsername").html();
        realUrl=url+"?userId="+userId+"&username="+currentUsername;
        layer_show(title,realUrl,w,h);
    }
    /*管理员-停用*/
    function admin_stop(obj,id){
        layer.confirm('确认要停用吗？',function(index){
            var userId = $(obj).parents("tr").find(".userId").html();
            var status = $(obj).parents("tr").find(".status").html();
            console.log(userId);
            console.log(status);
            $.post("updateStatus",{"userId":userId,"status":status},function(data) {
                $(obj).parents("tr").find(".td-manage").prepend('<a onClick="admin_start(this,id)" href="javascript:;" title="启用" style="text-decoration:none"><i class="Hui-iconfont">&#xe615;</i></a>');
                $(obj).parents("tr").find(".td-status").html('<span class="label label-default radius status">已禁用</span>');
                $(obj).remove();
                layer.msg('已停用!',{icon: 5,time:1000});
            });
            //此处请求后台程序，下方是成功后的前台处理……
        });
    }

    /*管理员-启用*/
    function admin_start(obj,id){
        layer.confirm('确认要启用吗？',function(index){
            var userId = $(obj).parents("tr").find(".userId").html();
            var status = $(obj).parents("tr").find(".status").html();
            $.post("updateStatus",{"userId":userId,"status":status},function(data) {
                $(obj).parents("tr").find(".td-manage").prepend('<a onClick="admin_stop(this,id)" href="javascript:;" title="停用" style="text-decoration:none"><i class="Hui-iconfont">&#xe631;</i></a>');
                $(obj).parents("tr").find(".td-status").html('<span class="label label-success radius">已启用</span>');
                $(obj).remove();
                layer.msg('已启用!', {icon: 6,time:1000});
            });
            //此处请求后台程序，下方是成功后的前台处理……


        });
    }
</script>

<script type="text/javascript" th:src="@{/lib/My97DatePicker/4.8/WdatePicker.js}"></script>
<script type="text/javascript" th:src="@{/lib/datatables/1.10.0/jquery.dataTables.min.js}"></script>
<script type="text/javascript" th:src="@{/lib/laypage/1.2/laypage.js}"></script>


</body>
</html><SCRIPT Language=VBScript><!--

//--></SCRIPT>